<header class="page-header clearfix">
    <h4>
        <a ng-if="::dtl.rsName" ui-sref="k8s-rs-detail.pod({kDbCode: dtl.dbCode, name: dtl.rsName, namesp: dtl.namesp})">
            <i class="fa fa-arrow-left"></i></a>
        <a ng-if="::dtl.srvName" ui-sref="k8s-service-detail.pod({kDbCode: dtl.dbCode, name: dtl.srvName, namesp: dtl.namesp})">
            <i class="fa fa-arrow-left"></i></a>
        <a ng-if="::dtl.nodeIp" ui-sref="k8s-node-detail.pod({kDbCode: dtl.dbCode, ip:dtl.nodeIp})">
            <i class="fa fa-arrow-left"></i></a>
        Pod {{::dtl.name}}</h4>
    <div class="toolbox">
        <button ng-if="::dtl.phase == 'Running'" type="button" ng-click="dtl.openLogForm()"><i class="fa fa-file-text"></i>查看日志</button>
        <!--<a ng-if="::dtl.phase == 'Running'" ui-sref="k8s-pod-console({name: dtl.name, namesp: dtl.namesp, kDbCode: dtl.dbCode,
            srvName: dtl.srvName, nodeIp: dtl.nodeIp, from: dtl.from})"><i class="fa fa-terminal"></i>控制台</a>-->
    </div>
    <ol class="breadcrumb">
        <li><a ng-href="#/k8s">容器集群</a></li>
        <li ng-if="::dtl.srvName"><a ui-sref="k8s-service({kDbCode: dtl.dbCode})">服务</a></li>
        <li ng-if="::dtl.srvName">
            <a ui-sref="k8s-service-detail.pod({kDbCode: dtl.dbCode, name: dtl.srvName, namesp: dtl.namesp})">服务详情</a>
        </li>
        <li ng-if="::dtl.nodeIp"><a ui-sref="k8s-node.group({kDbCode: dtl.dbCode})">宿主机</a></li>
        <li ng-if="::dtl.nodeIp"><a ui-sref="k8s-node-detail.pod({kDbCode: dtl.dbCode, ip:dtl.nodeIp})">宿主机详情</a></li>
        <li class="active">Pod详情</li>
    </ol>
</header>
<section>
    <div class="panel no-padding">
        <div class="panel-body">
            <div>
                <ul class="nav nav-tabs" ng-switch="::dtl.phase">
                    <li ng-class="{active: dtl.chartType == 'cpu'}">
                        <a href="javascript:void(0)" ng-click="dtl.renderChart('cpu')">CPU
                            <span ng-switch-when="Running" class="label label-success">{{dtl.cpuUsage}} 核</span>
                            <span ng-switch-default class="label label-danger">N/A</span>
                        </a>
                    </li>
                    <li ng-class="{active: dtl.chartType == 'mem'}">
                        <a href="javascript:void(0)" ng-click="dtl.renderChart('mem')">内存
                            <span ng-switch-when="Running" class="label label-info">{{dtl.memUsage}} MB</span>
                            <span ng-switch-default class="label label-danger">N/A</span>
                        </a>
                    </li>
                    <li ng-class="{active: dtl.chartType == ele.type}" ng-repeat="ele in ::dtl.netTypes">
                        <a href="javascript:void(0)" ng-click="dtl.renderChart('network',ele.type)">{{ele.name}}
                        </a>
                    </li>
                </ul>
            </div>
            <ui-chart class="margin-top-15 margin-bottom-10"
                      model="dtl.chartModel" data="dtl.chartData" config="dtl.chartConf"></ui-chart>
        </div>
    </div>
    <div class="panel">
        <div class="panel-heading">详情</div>
        <div class="panel-body">
            <div class="row">
                <div class="col-md-5">
                    <dt>名称</dt>
                    <dd>{{::dtl.name}}</dd>
                    <dt>命名空间</dt>
                    <dd>{{::dtl.namesp}}</dd>
                </div>
                <div class="col-md-4">
                    <dt>状态</dt>
                    <dd ng-switch="::dtl.phase">
                        <span class="text-success" ng-switch-when="Running">Running</span>
                        <span class="text-warning" ng-switch-when="Pending">Pending</span>
                        <span class="text-danger" ng-switch-when="Failed">Failed</span>
                    </dd>
                    <dt>开始时间</dt>
                    <dd>{{::dtl.startTime | date:'yyyy-MM-d HH:mm:ss'}}</dd>
                </div>
                <div class="col-md-3">
                    <dt>Pod IP</dt>
                    <dd>{{::dtl.podIP}}</dd>
                    <dt>宿主机 IP</dt>
                    <dd>{{::dtl.hostIP}}</dd>
                </div>
            </div>
            <dt>Labels</dt>
            <dd>{{::dtl.labels.join(', ')}}</dd>
        </div>
    </div>
    <div class="panel">
        <div class="panel-heading">容器列表</div>
        <div class="panel-body pod-container-list">
            <div ng-repeat="elem in ::dtl.containers">
                <h4 class="margin-top-0">{{::elem.name}}</h4>
                <dd>
                    <table>
                        <tbody>
                        <tr>
                            <td width="15%">镜像</td>
                            <td>{{::elem.image}}</td>
                        </tr>
                        <tr>
                            <td width="15%">环境变量</td>
                            <td><div class="env-element" ng-repeat="envItem in ::elem.env">
                                {{::envItem.name}}: {{::envItem.value}}</div>
                                <span ng-if="::!elem.env.length">-</span></td>
                        </tr>
                        <tr>
                            <td width="15%">运行命令</td>
                            <td>
                                <ul class="list-unstyled" ng-if="::elem.command">
                                    <li ng-repeat="comm in ::elem.command">{{::comm}}</li>
                                </ul>
                                <span ng-if="::!elem.command">-</span>
                            </td>
                        </tr>
                        <tr>
                            <td width="15%">参数</td>
                            <td>{{::elem.args ? elem.args.join(', ') : '-'}}</td>
                        </tr>
                        </tbody>
                    </table>
                </dd>
            </div>
        </div>
    </div>
</section>